<template>
  <div class="download-button-content">
    <el-button
      v-if="roundFlag"
      type="danger"
      :size="size"
      round
      @click="deleteFile"
    >
      删除<i class="el-icon-delete el-icon--right" />
    </el-button>
    <el-button
      v-if="circleFlag"
      type="danger"
      :size="size"
      circle
      @click="deleteFile"
    >
      <i class="el-icon-delete" />
    </el-button>
    <el-tooltip v-if="textFlag" effect="dark" content="删除" placement="top">
      <el-button type="text" :size="size" circle @click="deleteFile">
        <i class="el-icon-delete" />
      </el-button>
    </el-tooltip>
    <a href="javascript:;" class="red" v-if="liFlag" @click.stop="deleteFile">
      <i class="el-icon-delete"></i>删<span style="visibility: hidden">下</span
      >除
    </a>
  </div>
</template>

<script>
import fileService from '../../../api/file'
import { mapActions, mapGetters, mapMutations } from 'vuex'

export default {
  name: 'DeleteButton',
  components: {},
  props: {
    roundFlag: Boolean,
    circleFlag: Boolean,
    textFlag: Boolean,
    liFlag: Boolean,
    size: String,
    item: Object,
  },
  data() {
    return {}
  },
  methods: {
    ...mapActions({
      reloadFileList: 'file/loadFileList',
    }),
    ...mapMutations({
      setContextMenuVisible: 'file/setContextMenuVisible',
    }),
    deleteFile() {
      let _this = this
      if (_this.item) {
        _this.doDeleteFile(_this.item.fileId)
        return
        // if (_this.item.folderFlag === 1) {
        //   _this.setContextMenuVisible(false)
        //   _this.$message.error('文件夹暂不支持删除')
        //   return
        // } else {
        //   _this.doDeleteFile(_this.item.fileId)
        //   return
        // }
      }
      if (_this.multipleSelection && _this.multipleSelection.length > 0) {
        let fileIdArr = new Array()
        for (let i = 0; i < _this.multipleSelection.length; i++) {
          // if (_this.multipleSelection[i].folderFlag === 1) {
          //   _this.$message.error('文件夹暂不支持删除')
          //   fileIdArr = null
          //   _this.setContextMenuVisible(false)
          //   return false
          // }
          fileIdArr.push(_this.multipleSelection[i].fileId)
        }
        _this.doDeleteFile(fileIdArr.join('__,__'))
        return
      }
      _this.$message.error('请选择要删除的文件')
    },
    doDeleteFile(fileIds) {
      let _this = this
      _this
        .$confirm('文件删除后将保存在回收站，您确定这样做吗？', '删除文件', {
          confirmButtonText: '删除',
          cancelButtonText: '取消',
          type: 'warning',
        })
        .then(() => {
          fileService.delete(
            {
              fileIds: fileIds,
              // fileSizeDesc: _this.item.fileSizeDesc,
              userName: _this.username,
            },
            (res) => {
              _this.$message.success('删除成功')
              _this.reloadFileList()
              _this.setContextMenuVisible(false)
            },
            (res) => {
              _this.$message.error(res.message)
            }
          )
        })
    },
  },
  computed: {
    ...mapGetters(['multipleSelection', 'username']),
  },
  mounted() {},
  watch: {},
}
</script>

<style lang="scss">
.download-button-content {
  display: inline-block;
  margin-right: 10px;
  .el-button--text {
    color: #fff;
    &:hover {
      color: rgba($color: #fff, $alpha: 0.6);
    }
  }
}
</style>
